<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>内置对象</title>
    <style>
        .clock{
            font-size: 25px;
            font-weight: bold;
        }
    </style>
</head>

<body>
    <h2>格式化时间</h2>
    <button id="btn1">获取当前时间</button>
    <div>
        <span class="time12">2020年6月1日 上午 09:37:20</span>
        <br>
        <span class="time24">2020年6月1日 09:37:20</span>
    </div>
    <hr>
    <h2>计算时间</h2>
    <label for="year">年</label><input type="text" id="year">
    <label for="month">月</label><input type="text" id="month">
    <label for="day">日</label><input type="text" id="day">
    <button id="btn2">计算</button>
    <div>
        <span>离端午节（2020年6月25日）还有<span id="dw-days">0</span>天</span>
    </div>
    <hr>
    <h2>倒计时</h2>
    <!-- <div class="countDown">距离下班还有<span class="hour">0</span>:<span class="min">0</span>:<span class="second">0</span> -->
    <div class="countDown">距离下班还有<span class="hour">0</span>:<span class="min">0</span>:<span class="second">0</span>
    </div>
    <h2>电子时钟</h2>
    <div class="clock">
        <span class="sz-hour">0</span>:<span class="sz-min">0</span>:<span class="sz-second">0</span>
    </div>

  <script src="./js/time.js"></script>
</body>

</html>